<template>
    <Head/>
    <div>
        <div id="question_part">
            {{question_content}}
        </div>
        <div id="answer_part">
            <div id="code_type">
                <el-select v-model="value" clearable placeholder="请选择">
                    <el-option
                            v-for="item in code_type"
                            :key="item.value"
                            :label="item.label"
                            :value="item.value">
                    </el-option>
                </el-select>
            </div>
            <el-input
                    style="background: #99a9bf"
                    type="textarea"
                    v-model="code"
                    :autosize="{minRows:22}"
                    show-word-limit/>

            <el-button @click="getCode" type="primary">确认提交</el-button>
        </div>
    </div>
</template>

<script>
    import Head from "@/components/Head";
    import Foot from "@/components/Foot";
    export default {
        name: "Question",
        components: {Foot, Head},
        data(){
            return{
                question_content:'题目背景\n' +
                    '强烈推荐新用户必读帖。\n' +
                    '\n' +
                    '不熟悉算法竞赛的选手请看这里：\n' +
                    '\n' +
                    '算法竞赛中要求的输出格式中，不能有多余的内容，这也包括了“请输入整数 a 和 b” 这一类的提示用户输入信息的内容。若包含了这些内容，将会被认为是 Wrong Answer，即洛谷上的 WA。在对比代码输出和标准输出时，系统将忽略每一行结尾的空格，以及最后一行之后多余的换行符。\n' +
                    '\n' +
                    '若因此类问题出现本机（看起来）AC，提交 WA 的现象，请勿认为是洛谷评测机出了问题，而是你的代码中可能存在多余的输出信息。用户可以参考在题目末尾提供的代码。\n' +
                    '\n' +
                    '另外请善用应用中的在线 IDE 功能，以避免不同平台的评测中所产生的一些问题。\n' +
                    '\n' +
                    '还有一点很重要的是，请不要在对应的题目讨论区中发布自己的题解，请发布到题解区域中，否则将处以删除或禁言的处罚。若发现无法提交题解则表明本题题解数量过多，仍不应发布讨论。\n' +
                    '\n' +
                    '题目描述\n' +
                    '输入两个整数 a, ba,b，输出它们的和（|a|,|b| \\le {10}^9∣a∣,∣b∣≤10 \n' +
                    '9\n' +
                    ' ）。\n' +
                    '\n' +
                    '注意\n' +
                    '\n' +
                    'Pascal 使用 integer 会爆掉哦！\n' +
                    '有负数哦！\n' +
                    'C/C++ 的 main 函数必须是 int 类型，而且 C 最后要 return 0。这不仅对洛谷其他题目有效，而且也是 NOIP/CSP/NOI 比赛的要求！\n' +
                    '好吧，同志们，我们就从这一题开始，向着大牛的路进发。\n' +
                    '\n' +
                    '任何一个伟大的思想，都有一个微不足道的开始。\n' +
                    '\n' +
                    '输入格式\n' +
                    '两个以空格分开的整数。\n' +
                    '\n' +
                    '输出格式\n' +
                    '一个整数。\n' +
                    '\n' +
                    '输入输出样例\n' +
                    '输入 #1复制\n' +
                    '20 30\n' +
                    '输出 #1复制\n' +
                    '50',
                code_type:[
                    {
                        value:'java',
                        label:'java'
                    },
                    {
                        value: 'python',
                        label: 'python'
                    },
                    {
                        value: 'c/c++',
                        label: 'c/c++'
                    }
                ],
                value: '',
                code:'#include<stdio.h>\n' +
                    'int main(){\n' +
                    'int a,b;\n' +
                    'scanf("%d%d",&a&b);\n' +
                    'printf("%d",a+b);\n' +
                    'return 0;\n' +
                    '}'
            }
        },
        methods:{
            getCode(){
                console.log(this.code)
                this.axios.post("/question",this.code).then(
                    function (response) {
                        if(response.data.code==100){
                            alert("发送成功"+JSON.stringify(response.data.data))
                        }
                    }
                )
            }
        }
    }
</script>

<style scoped>
#question_part{
    width: 70%;
    height: 400px;
    border-style: inset;
    border-width: 5px;
    border-color: #606266;
    background: #EBEEF5;
}
#answer_part{
    width: 70%;
    height: 600px;
}
</style>
